<template>
	<view class="page">
		<pageTxt>
			<!--  v-model="dataList" @query="queryList" -->
			<z-paging ref="paging" refresher-only @onRefresh="onRefresh" :paging-style="{ 'background-color': '#f7f7f7', height: '100%', width: '100%' }">
				<!-- 头部 -->
				<template slot="top">
					<u-navbar title="合同详情" :autoBack="true" :fixed="false"></u-navbar>
					<!-- <view class="tab-box">
						<u-tabs
							:current="tabIndex"
							@click="tabClickFunc"
							:list="tablist"
							inactiveStyle="color: #919092;"
							activeStyle="color: #3B75FF;"
							lineColor="#3B75FF"
						></u-tabs>
					</view> -->
				</template>
				<!-- 内容 -->
				<view class="detail-content-box" v-if="dataObj">
					<u-empty
						v-if="!$fieldShowFunc('13-htxx') && !$fieldShowFunc('13-xmxx')"
						marginTop="300rpx"
						icon="https://hzybucket.obs.cn-south-1.myhuaweicloud.com/we_chat/no-msg2.png"
						text=" "
					></u-empty>
					<view class="item-box" v-if="$fieldShowFunc('13-xmxx')">
						<view class="title">项目信息</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_xmmc')">
							<text class="txt">项目名称</text>
							<view class="content">
								{{ dataObj.project_name }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_xmbh')">
							<text class="txt">项目编号</text>
							<view class="content">
								<text class="txt-btn" @click="navToProjectFunc">{{ dataObj.project_number }}</text>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_xmpp')">
							<text class="txt">项目品牌</text>
							<view class="content">
								{{ dataObj.brand_name }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_xmlx')">
							<text class="txt">项目类型</text>
							<view class="content">
								{{ dataObj.store_type_name }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_yfje')">
							<text class="txt">已付金额</text>
							<view class="content">{{ dataObj.paid_amount }}元</view>
						</view>
					</view>
					<view class="item-box" v-if="$fieldShowFunc('13-htxx')">
						<view class="title">合同信息</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htlx')">
							<text class="txt">合同类型</text>
							<view class="content">
								<template v-if="dataObj.contract_type == 1">施工合同</template>
								<template v-if="dataObj.contract_type == 2">勘场合同</template>
								<template v-if="dataObj.contract_type == 3">增减项合同</template>
								<template v-if="dataObj.contract_type == 4">定金合同</template>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_qyzt')">
							<text class="txt">主体账号</text>
							<view class="content">
								{{ dataObj.account_name || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htbh')">
							<text class="txt">合同编号</text>
							<view class="content">
								{{ dataObj.contract_number || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htqyrq')">
							<text class="txt">合同签约日期</text>
							<view class="content">
								{{ dataObj.signing_date || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_hekgrq') && (dataObj.contract_type == 1 || dataObj.contract_type == 3)">
							<text class="txt">合同开工日期</text>
							<view class="content">
								{{ dataObj.contract_commencement_date || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_hewgrq') && (dataObj.contract_type == 1 || dataObj.contract_type == 3)">
							<text class="txt">合同完工日期</text>
							<view class="content">
								{{ dataObj.contract_completion_date || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htgq') && (dataObj.contract_type == 1 || dataObj.contract_type == 3)">
							<text class="txt">合同工期</text>
							<view class="content">
								{{ dataObj.contract_duration_days ? dataObj.contract_duration_days + '天' : '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_heqyje')">
							<text class="txt">签约金额</text>
							<view class="content">
								{{ dataObj.contract_price ? dataObj.contract_price + '元' : '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_sqkje') && dataObj.contract_type == 1">
							<text class="txt">首期款</text>
							<view class="content">
								{{ dataObj.down_payment ? dataObj.down_payment + '元' : '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_jdkje') && dataObj.contract_type == 1">
							<text class="txt">进度款</text>
							<view class="content">{{ dataObj.progress_payment ? dataObj.progress_payment + '元' : '--' }}</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_wkje') && dataObj.contract_type == 1">
							<text class="txt">尾款</text>
							<view class="content">
								{{ dataObj.balance_payment ? dataObj.balance_payment + '元' : '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htbz')">
							<text class="txt">合同备注</text>
							<view class="content">
								{{ dataObj.remark || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htzt')">
							<text class="txt">合同状态</text>
							<view class="content">
								{{ dataObj.contract_state == 1 ? '已签约' : '已作废' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_cjsj')">
							<text class="txt">合同创建时间</text>
							<view class="content">
								{{ dataObj.created_at || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htcjr')">
							<text class="txt">合同创建人</text>
							<view class="content">
								{{ dataObj.handlers_name || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htfj')">
							<text class="txt">合同附件</text>
							<view class="content flex ac flex">
								<image
									v-for="(item, index) in dataObj.contract_files"
									:key="index"
									@click="previewFunc(item)"
									:src="$fileImgFunc(item)"
									mode="aspectFill"
									class="img-box"
								></image>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htbjd')">
							<text class="txt">报价单</text>
							<view class="content flex ac flex" v-if="dataObj.quotation_file">
								<image @click="previewFunc(dataObj.quotation_file)" :src="$fileImgFunc(dataObj.quotation_file)" mode="aspectFill" class="img-box"></image>
							</view>
							<view v-else>--</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htlrd')">
							<text class="txt">利润单</text>
							<view class="content flex ac flex" v-if="dataObj.profit_statement_file">
								<image
									@click="previewFunc(dataObj.profit_statement_file)"
									:src="$fileImgFunc(dataObj.profit_statement_file)"
									mode="aspectFill"
									class="img-box"
								></image>
							</view>
							<view v-else>--</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('ht_htgclqd')">
							<text class="txt">工程量清单</text>
							<view class="content flex ac flex" v-if="dataObj.cost_list_file">
								<image @click="previewFunc(dataObj.cost_list_file)" :src="$fileImgFunc(dataObj.cost_list_file)" mode="aspectFill" class="img-box"></image>
							</view>
							<view v-else>--</view>
						</view>
						<view
							class="item-box-item flex jb"
							v-if="$fieldShowFunc('ht_qybjd') && $isPer(per_arr, ['contractDetail_ysDetail']) && (dataObj.contract_type == 1 || dataObj.contract_type == 3)"
						>
							<text class="txt">签约报价单</text>
							<view class="content" @click="jump">
								<text class="txt-btn">点击查看</text>
							</view>
						</view>
					</view>
				</view>
				<view class="bottom-btn-box flex ac jb" slot="bottom">
					<view style="width: 100%">
						<judgeBtn v-if="!loading" info unborder :per_arr="per_arr" :btns="btns" :state="dataObj.contract_state" :item="dataObj" @change="btnsChange"></judgeBtn>
					</view>
				</view>
			</z-paging>
		</pageTxt>
		<!-- 文件预览 -->
		<preFileCom :fileObj="fileObj" @onFileSuccess="fileObj = ''"></preFileCom>

		<contractManagement :value.sync="per_name" :oper_item="oper_item" @submit="handleSubmit"></contractManagement>
	</view>
</template>

<script>
export default {
	data() {
		return {
			per_arr: [],
			btns: [
				{
					per_name: 'contract_contractInvalidation',
					state: 1,
					name: '合同作废'
				}
			],
			// 操作相关
			oper_item: {},
			per_name: '',

			fileObj: '',
			loading: true,
			dataObj: '',
			tabIndex: 0,
			tablist: [
				{
					name: '项目信息'
				},
				{
					name: '合同信息'
				}
			],
			per_arr: []
		};
	},
	onLoad(option) {
		// 获取权限
		this.$Api
			.getHtmlAuthority({
				path: '/contractManagement'
			})
			.then((res) => {
				console.log(res, 'getHtmlAuthority');
				if (res.code == 200) {
					this.per_arr = res.data.permission;
				}
			});
		this.getContractDetails(option.id);

		// 获取权限
		this.$Api
			.getHtmlAuthority({
				path: '/contractManagement'
			})
			.then((res) => {
				console.log(res, 'getHtmlAuthority');
				if (res.code == 200) {
					this.per_arr = res.data.permission;
				}
			});
	},
	methods: {
		onRefresh() {
			this.getContractDetails(this.dataObj.id);
			this.$refs.paging.complete();
		},
		tabClickFunc(e) {
			this.tabIndex = e.index;
		},
		// 合同详情
		getContractDetails(contract_id) {
			this.loading = true;
			this.$Apipc
				.getContractDetails({
					contract_id
				})
				.then((res) => {
					console.log(res, '合同详情');
					this.loading = false;
					if (res.code == 200) {
						this.dataObj = res.data;
					}
				});
		},
		// 预览
		previewFunc(item) {
			this.fileObj = item;
		},

		// 操作按钮触发点击
		btnsChange(e) {
			console.log(e, 'xxxsww');
			this.oper_item = e.item;
			this.per_name = e.per_name;
		},

		handleSubmit(type) {
			this.onRefresh();
		},

		jump() {
			uni.navigateTo({
				url: '/pagesB/budgetManagementDetail/budgetManagementDetail?id=' + this.dataObj.project_id
			});
		},
		// 去详情项目
		navToProjectFunc() {
			uni.navigateTo({
				url: '/pagesB/projectDetail/projectDetail?id=' + this.dataObj.project_id
			});
		}
	}
};
</script>

<style lang="scss" scoped>
@import 'contractDetail.scss';
</style>
